import React, { PropTypes, Component } from 'react';
import Table from './MyTable'
import Column from './Column'
import { myAjax, ROOTURL_TABLE } from './../publicAPI/publicAPI';
import styles from './SimpleTable.css';

export default React.createClass({
  getInitialState: function() {
    let date = new Date();
    return {
      year: date.getFullYear(),
      month: date.getMonth() + 1,
      tData: [{}],
      hasClicked: true
    };
  },
  componentWillMount: function() {
    let _this = this;
    myAjax(ROOTURL_TABLE + '/cafune/wallet/depositdailysum.api', 'POST', { year:this.state.year, month:this.state.month }, function(data) {
      //console.log(data);
      let processData = [];
	    processData.push(data.walletDailyDepositSum);
      //console.log(processData);
      this.setState({
      	tData: processData
      });
    }.bind(_this), function(err) {});
  },
  handleClick: function() {
  	let yearSelect = parseInt(this.refs.yearSelect.value);
  	let monthSelect = parseInt(this.refs.monthSelect.value);
      if(!yearSelect || !(/^2\d{3}$/.test(yearSelect))) {
        alert("内容不能为空或格式错误");
        this.refs.yearSelect.focus();
        return
      }
      if(!monthSelect || !(/^0?[1-9]{1}$|1[0-2]/.test(monthSelect))) {
        alert("内容不能为空或格式错误");
        this.refs.monthSelect.focus();
        return
      }
  	let _this = this;
  	myAjax(ROOTURL_TABLE + '/cafune/wallet/depositdailysum.api', 'POST', {year:yearSelect, month: monthSelect}, function(data) {
  	  console.log(data);
  	  let processData = [];
  	  processData.push(data.walletDailyDepositSum);
  	  this.setState({
  	    tData: processData
  	  });
  	}.bind(_this), function(err) {alert("获取服务器内容失败");});
  },
  handleKeyPress: function(e) {
    if(e.which == 13) {
      this.handleClick();
    }
  },

  render: function() {
    return (
      <div>
      	<div>
      		<label >
      			<input ref="yearSelect" onKeyPress={this.handleKeyPress} className={styles.input} placeholder="如：2016" />年
      			<span>&nbsp;&nbsp;</span><input ref="monthSelect" onKeyPress={this.handleKeyPress} className={styles.input} placeholder="如：3" />月
      		</label>
			<button onClick={this.handleClick} className={styles.button}>确定</button>
      	</div>
        <Table data={this.state.tData} className={styles.container} needSum="false">
          {
            Object.keys(this.state.tData[0]).map(entry => {
              if(/\d/.test(entry)) {
                return <Column dataKey={entry} name={entry} width="50px" key={`col-${entry}`}/>
              }   
            })
          }
        </Table>
      </div>
    );
  }
});



